<%@ include file="base.jsp" %>
<%@ page isELIgnored ="true" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<html>
<head>
<title>Insert title here</title>
<script type="text/javascript">
	$(document).ready(function() {
	});
 
</script>
	<script type="text/javascript">
		$(function(){
			$('#cc').combo({
				required:true,
				editable:false
			});
			$('#sp').appendTo($('#cc').combo('panel'));
			$('#sp input').click(function(){
				var v = $(this).val();
				var s = $(this).next('span').text();
				$('#cc').combo('setValue', v).combo('setText', s).combo('hidePanel');
			});
			$('#combox').combobox({
				url:'../json',
				valueField:'userName',
				textField:'password',
				onSelect:function(rec){
					//复选框联动
					//var url = 'get_data2.php?id='+rec.id; 
					//$('#cc2').combobox('reload', url);  
					alert(rec.userName);
				}
			});
			$('#combotree').combotree({
				url:'json/tree_data1.json',
				required:true
			});
			$("#combogrid").combogrid({
				panelWidth:200,
				value:'004',
				
				idField:'password',
				textField:'userName',
				url:'../json',
				columns:[[
					{field:'userName',title:'userName',width:100},
					{field:'password',title:'password',width:100}
		          ]],
				onSelect:function(b){
					alert(b);
				}
			});
			$('#datebox').datebox({
				required:true,
				onSelect:function(date){
					alert(date.getFullYear()+":"+(date.getMonth()+1)+":"+date.getDate());
				}
			});
			$('#timespinner').timespinner({
				min:'08:33',
				required:true,
				showSecondes:true
				
			});
		});
	</script>
</head>
<body>
	<h2>Basic Combo</h2>
	<div class="demo-info" style="margin-bottom:10px">
		<div class="demo-tip icon-tip"></div>
		<div>Click the right arrow button to show drop down panel that can be filled with any content.</div>
	</div>
	<select id="cc" style="width:150px"></select>
	<div id="sp">
		<div style="color:#99BBE8;background:#fafafa;padding:5px;">Select a language</div>
		<input type="radio" name="lang" value="01"><span>Java</span><br/>
		<input type="radio" name="lang" value="02"><span>C#</span><br/>
		<input type="radio" name="lang" value="03"><span>Ruby</span><br/>
		<input type="radio" name="lang" value="04"><span>Basic</span><br/>
		<input type="radio" name="lang" value="05"><span>Fortran</span>
	</div>
	<input id="combox" name="dept" value="请选择"/>
	<input id="combotree" value="01">
	
	<input id="combogrid" name="dept" value="请选择" />  
	<input id="datebox" name="date"/>
	<input id="timespinner" name="time"/>
</body>
</html>